membershipForm.js ➔ ... ➔ addressIsValid - Code Metrics - Inspection of "Merge pull request #805 from wmde/fix-async-valida..." - wmde/FundraisingFrontend - Measure and Improve Code Quality continuously with Scrutinizer

Completed

Push — master ( ebbfd2...019445 )

by Jeroen De

created 2017-01-17 22:46 UTC

membershipForm.js ➔ ... ➔ addressIsValid A

↳ Parent: membershipForm.js ➔ $

Complexity

Conditions	1
Paths	1

Size

Total Lines

Duplication

Lines	3
Ratio	100 %

Importance

Changes

Metric	Value
cc	1
nc	1
nop	0
dl	3
loc	3
rs	10
c	0
b	0
f	0

$( function () {

	/** global: WMDE */

	var initData = $( '#init-form' ),
		store = WMDE.Store.createMembershipStore(
			WMDE.createInitialStateFromViolatedFields( initData.data( 'violatedFields' ), {} )
		),
		actions = WMDE.Actions;

	WMDE.StoreUpdates.connectComponentsToStore(
		[
			WMDE.Components.createRadioComponent( store, $( '.membership-type-select' ), 'membershipType' ),
			WMDE.Components.createRadioComponent( store, $( '.address-type-select' ), 'addressType' ),
			WMDE.Components.createRadioComponent( store, $( '.salutation-select' ), 'salutation' ),
			WMDE.Components.createSelectMenuComponent( store, $( '#personal-title' ), 'title' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#first-name' ), 'firstName' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#last-name' ), 'lastName' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#company-name' ), 'companyName' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#street' ), 'street' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#post-code' ), 'postcode' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#city' ), 'city' ),
			WMDE.Components.createSelectMenuComponent( store, $( '#country' ), 'country' ),
			WMDE.Components.createTextComponent( store, $( '#email' ), 'email' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#date-of-birth' ), 'dateOfBirth' ),
			WMDE.Components.createValidatingTextComponent( store, $( '#phone' ), 'phoneNumber' ),
			WMDE.Components.createRadioComponent( store, $( '.payment-type-select' ), 'paymentType' ),
			WMDE.Components.createRadioComponent( store, $( '.payment-period-select' ), 'paymentIntervalInMonths' ),
			WMDE.Components.createAmountComponent( store, $( '.amount-input' ), $( '.amount-select' ), $( '#amount-hidden' ) ),
			WMDE.Components.createBankDataComponent( store, {
				ibanElement: $( '#iban' ),
				bicElement: $( '#bic' ),
				accountNumberElement: $( '#account-number' ),
				bankCodeElement: $( '#bank-code' ),
				bankNameFieldElement: $( '#field-bank-name' ),
				bankNameDisplayElement: $( '#bank-name' ),
				debitTypeElement: $( '.debit-type-select' )
			} ),
			WMDE.Components.createValidatingCheckboxComponent( store, $( '#confirmSepa' ), 'confirmSepa' )
		],
		store,
		'membershipFormContent'
	);

	WMDE.StoreUpdates.connectValidatorsToStore(
		function ( initialValues ) {
			return [
				WMDE.ValidationDispatchers.createFeeValidationDispatcher(
					WMDE.FormValidation.createFeeValidator( initData.data( 'validate-fee-url' ) ),
					initialValues
				),
				WMDE.ValidationDispatchers.createAddressValidationDispatcher(
					WMDE.FormValidation.createAddressValidator(
						initData.data( 'validate-address-url' ),
						WMDE.FormValidation.DefaultRequiredFieldsForAddressType
					),
					initialValues
				),
				WMDE.ValidationDispatchers.createEmailValidationDispatcher(
					WMDE.FormValidation.createEmailAddressValidator( initData.data( 'validate-email-address-url' ) ),
					initialValues
				),
				WMDE.ValidationDispatchers.createBankDataValidationDispatcher(
					WMDE.FormValidation.createBankDataValidator(
						initData.data( 'validate-iban-url' ),
						initData.data( 'generate-iban-url' )
					),
					initialValues
				),
				WMDE.ValidationDispatchers.createSepaConfirmationValidationDispatcher(
					WMDE.FormValidation.createSepaConfirmationValidator(),
					initialValues
				)
			];
		},
		store,
		initData.data( 'initial-form-values' ),
		'membershipFormContent'
	);

	// Connect view handlers to changes in specific parts in the global state, designated by 'stateKey'
	WMDE.StoreUpdates.connectViewHandlersToStore(
		[
			{
				viewHandler: WMDE.View.createFormPageVisibilityHandler( {
					personalData: $( "#personalDataPage" ),
					bankConfirmation: $( '#bankConfirmationPage' )
				} ),
				stateKey: 'formPagination'
			},
			{
				viewHandler: WMDE.View.createErrorBoxHandler( $( '#validation-errors' ), {
					amount: 'Betrag',
					salutation: 'Anrede',
					title: 'Titel',
					firstName: 'Vorname',
					lastName: 'Nachname',
					companyName: 'Firma',
					street: 'Straße',
					postcode: 'PLZ',
					city: 'Ort',
					country: 'Land',
					email: 'E-Mail',
					dateOfBirth: 'Geburtsdatum',
					phone: 'Telefonnummer',
					iban: 'IBAN',
					bic: 'BIC',
					accountNumber: 'Kontonummer',
					bankCode: 'Bankleitzahl',
					confirmSepa: 'SEPA-Lastschrift'
				} ),
				stateKey: 'membershipInputValidation'
			},
			{
				viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#finishFormSubmit' ), /^PPL$|^$/ ),
				stateKey: 'membershipFormContent.paymentType'
			},
			{
				viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#continueFormSubmit' ), 'BEZ' ),
				stateKey: 'membershipFormContent.paymentType'
			},
			{
				viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.fields-direct-debit' ), 'BEZ' ),
				stateKey: 'membershipFormContent.paymentType'
			},
			{
				viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.slide-sepa' ), 'sepa' ),
				stateKey: 'membershipFormContent.debitType'
			},
			{
				viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.slide-non-sepa' ), 'non-sepa' ),
				stateKey: 'membershipFormContent.debitType'
			},
			{
				viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.person-name' ), 'person' ),
				stateKey: 'membershipFormContent.addressType'
			},
			{
				viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.company-name' ), 'firma' ),
				stateKey: 'membershipFormContent.addressType'
			},
			{
				viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#address-type-2' ).parent(), 'sustaining' ),
				stateKey: 'membershipFormContent.membershipType'
			},
			{
				viewHandler: WMDE.View.createFeeOptionSwitcher( [ $( '#amount-1' ), $( '#amount-2' ), $( '#amount-3' ), $( '#amount-4' ), $( '#amount-5' ), $( '#amount-6' ), $( '#amount-7' ) ], { person: 24, firma: 100 } ),
				stateKey: 'membershipFormContent'
			},
			{
				viewHandler: WMDE.View.createPaymentSummaryDisplayHandler(
					$( '#membership-confirm-interval' ),
					$( '#membership-confirm-fee'),
					$( '#membership-payment-type' ), // does not exist yet
					{
						'0': 'einmalig',
						'1': 'monatlich',
						'3': 'quartalsweise',
						'6': 'halbjährlich',
						'12': 'jährlich'
					},
					{
						'BEZ': 'Lastschrift',
						'UEB': 'Überweisung',
						'MCP': 'Kreditkarte',
						'PPL': 'PayPal'
					},
					WMDE.CurrencyFormatter.createCurrencyFormatter( 'de' )
				),
				stateKey: 'membershipFormContent'
			},
			{
				viewHandler: WMDE.View.createDisplayAddressHandler( {
					fullName: $( '#membership-confirm-name' ),
					street: $( '#membership-confirm-street' ),
					postcode: $( '#membership-confirm-postcode' ),
					city: $( '#membership-confirm-city' ),
					country: $( '#membership-confirm-country' ),
					email: $( '#membership-confirm-mail' )
				} ),
				stateKey: 'membershipFormContent'
			},
			{
				viewHandler: WMDE.View.createBankDataDisplayHandler(
					$( '#membership-confirm-iban' ),
					$( '#membership-confirm-bic' ),
					$( '#membership-confirm-bankname' )
				),
				stateKey: 'membershipFormContent'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#first-name' ) ),
				stateKey: 'membershipInputValidation.firstName'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#last-name' ) ),
				stateKey: 'membershipInputValidation.lastName'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#street' ) ),
				stateKey: 'membershipInputValidation.street'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#post-code' ) ),
				stateKey: 'membershipInputValidation.postcode'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#city' ) ),
				stateKey: 'membershipInputValidation.city'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#email' ) ),
				stateKey: 'membershipInputValidation.email'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#company-name' ) ),
				stateKey: 'membershipInputValidation.companyName'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#date-of-birth' ) ),
				stateKey: 'membershipInputValidation.dateOfBirth'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#phone' ) ),
				stateKey: 'membershipInputValidation.phoneNumber'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#iban' ) ),
				stateKey: 'membershipInputValidation.iban'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#bic' ) ),
				stateKey: 'membershipInputValidation.bic'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#account-number' ) ),
				stateKey: 'membershipInputValidation.accountNumber'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#bank-code' ) ),
				stateKey: 'membershipInputValidation.bankCode'
			},
			{
				viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '.amount-input' ) ),
				stateKey: 'membershipInputValidation.amount'
			}
		],
		store
	);

	// Validity checks for different form parts

	function displayErrorBox() {
		$( '#validation-errors' ).show();
		$( 'html, body' ).animate( { scrollTop: $( '#validation-errors' ).offset().top } );
	}

	function addressIsValid() {
		return store.getState().validity.address;
	}

	function bankDataIsValid() {
		return store.getState().membershipFormContent.paymentType !== 'BEZ' || store.getState().validity.bankData;
	}

	function formDataIsValid() {
		var validity = store.getState().validity;
		return !hasInvalidFields() && validity.paymentData && addressIsValid() && bankDataIsValid();
	}

	function triggerValidityCheckForPersonalDataPage() {
		var formContent = store.getState().membershipFormContent;

		if ( !addressIsValid() ) {
			if ( formContent.addressType === 'person' ) {
				store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
					[ 'salutation', 'firstName', 'lastName', 'street', 'postcode', 'city', 'email' ],
					[ 'companyName' ]
				) );
			} else if ( formContent.addressType === 'firma' ) {
				store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
					[ 'companyName', 'street', 'postcode', 'city', 'email' ],
					[ 'firstName', 'lastName', 'salutation' ]
				) );
			}
		}

		if ( !bankDataIsValid() ) {
			store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
				[ 'iban', 'bic' ]
			) );
		}

		if ( !store.getState().validity.amount ) {
			store.dispatch( actions.newMarkEmptyFieldsInvalidAction( [ 'amount' ] ) );
		}
	}

	function hasInvalidFields() {
		var invalidFields = false;
		$.each( store.getState().membershipInputValidation, function( key, value ) {
			if ( value.isValid === false ) {
				invalidFields = true;
			}
		} );

		return invalidFields;
	}

	function triggerValidityCheckForSepaPage() {
		if ( !store.getState().validity.sepaConfirmation ) {
			store.dispatch( actions.newMarkEmptyFieldsInvalidAction( [ 'confirmSepa' ] ) );
		}
	}

	function handleMembershipDataSubmitForDirectDebit() {
		if ( formDataIsValid() ) {
			store.dispatch( actions.newNextPageAction() );
			$( 'section#donation-amount, section#donation-sheet' ).hide();
		} else {
			triggerValidityCheckForPersonalDataPage();
			displayErrorBox();
		}
	}

	function handleMembershipDataSubmitForNonDirectDebit() {
		if ( formDataIsValid() ) {
			$( '#memForm' ).submit();
		} else {
			triggerValidityCheckForPersonalDataPage();
			displayErrorBox();
		}
	}

	$( '#continueFormSubmit' ).click( WMDE.StoreUpdates.makeEventHandlerWaitForAsyncFinish( handleMembershipDataSubmitForDirectDebit, store ) );

	$( '#finishFormSubmit' ).click( WMDE.StoreUpdates.makeEventHandlerWaitForAsyncFinish( handleMembershipDataSubmitForNonDirectDebit, store ) );

	$( '.back-button' ).click( function () {
		// TODO check if page is valid
		store.dispatch( actions.newResetFieldValidityAction( [ 'confirmSepa' ] ) );
		store.dispatch( actions.newPreviousPageAction() );
	} );

	$( '#finishFormSubmit2' ).click( function () {
		if ( store.getState().validity.sepaConfirmation ) {
			$( '#memForm' ).submit();
		} else {
			triggerValidityCheckForSepaPage();
			displayErrorBox();
		}
	} );

	// Initialize form pages
	store.dispatch( actions.newAddPageAction( 'personalData' ) );
	store.dispatch( actions.newAddPageAction( 'bankConfirmation' ) );

	// Set initial form values
	store.dispatch( actions.newInitializeContentAction( initData.data( 'initial-form-values' ) ) );

} );


1	View Code Duplication	$( function () {
		0 ignored issues – show Duplication introduced 2016-07-04 17:07 UTC by Report Bug Copy Issue Report This code seems to be duplicated in your project. Loading history...
2		/** global: WMDE */
3
4		var initData = $( '#init-form' ),
5		store = WMDE.Store.createMembershipStore(
6		WMDE.createInitialStateFromViolatedFields( initData.data( 'violatedFields' ), {} )
7		),
8		actions = WMDE.Actions;
9
10		WMDE.StoreUpdates.connectComponentsToStore(
11		[
12		WMDE.Components.createRadioComponent( store, $( '.membership-type-select' ), 'membershipType' ),
13		WMDE.Components.createRadioComponent( store, $( '.address-type-select' ), 'addressType' ),
14		WMDE.Components.createRadioComponent( store, $( '.salutation-select' ), 'salutation' ),
15		WMDE.Components.createSelectMenuComponent( store, $( '#personal-title' ), 'title' ),
16		WMDE.Components.createValidatingTextComponent( store, $( '#first-name' ), 'firstName' ),
17		WMDE.Components.createValidatingTextComponent( store, $( '#last-name' ), 'lastName' ),
18		WMDE.Components.createValidatingTextComponent( store, $( '#company-name' ), 'companyName' ),
19		WMDE.Components.createValidatingTextComponent( store, $( '#street' ), 'street' ),
20		WMDE.Components.createValidatingTextComponent( store, $( '#post-code' ), 'postcode' ),
21		WMDE.Components.createValidatingTextComponent( store, $( '#city' ), 'city' ),
22		WMDE.Components.createSelectMenuComponent( store, $( '#country' ), 'country' ),
23		WMDE.Components.createTextComponent( store, $( '#email' ), 'email' ),
24		WMDE.Components.createValidatingTextComponent( store, $( '#date-of-birth' ), 'dateOfBirth' ),
25		WMDE.Components.createValidatingTextComponent( store, $( '#phone' ), 'phoneNumber' ),
26		WMDE.Components.createRadioComponent( store, $( '.payment-type-select' ), 'paymentType' ),
27		WMDE.Components.createRadioComponent( store, $( '.payment-period-select' ), 'paymentIntervalInMonths' ),
28		WMDE.Components.createAmountComponent( store, $( '.amount-input' ), $( '.amount-select' ), $( '#amount-hidden' ) ),
29		WMDE.Components.createBankDataComponent( store, {
30		ibanElement: $( '#iban' ),
31		bicElement: $( '#bic' ),
32		accountNumberElement: $( '#account-number' ),
33		bankCodeElement: $( '#bank-code' ),
34		bankNameFieldElement: $( '#field-bank-name' ),
35		bankNameDisplayElement: $( '#bank-name' ),
36		debitTypeElement: $( '.debit-type-select' )
37		} ),
38		WMDE.Components.createValidatingCheckboxComponent( store, $( '#confirmSepa' ), 'confirmSepa' )
39		],
40		store,
41		'membershipFormContent'
42		);
43
44		WMDE.StoreUpdates.connectValidatorsToStore(
45		function ( initialValues ) {
46		return [
47		WMDE.ValidationDispatchers.createFeeValidationDispatcher(
48		WMDE.FormValidation.createFeeValidator( initData.data( 'validate-fee-url' ) ),
49		initialValues
50		),
51		WMDE.ValidationDispatchers.createAddressValidationDispatcher(
52		WMDE.FormValidation.createAddressValidator(
53		initData.data( 'validate-address-url' ),
54		WMDE.FormValidation.DefaultRequiredFieldsForAddressType
55		),
56		initialValues
57		),
58		WMDE.ValidationDispatchers.createEmailValidationDispatcher(
59		WMDE.FormValidation.createEmailAddressValidator( initData.data( 'validate-email-address-url' ) ),
60		initialValues
61		),
62		WMDE.ValidationDispatchers.createBankDataValidationDispatcher(
63		WMDE.FormValidation.createBankDataValidator(
64		initData.data( 'validate-iban-url' ),
65		initData.data( 'generate-iban-url' )
66		),
67		initialValues
68		),
69		WMDE.ValidationDispatchers.createSepaConfirmationValidationDispatcher(
70		WMDE.FormValidation.createSepaConfirmationValidator(),
71		initialValues
72		)
73		];
74		},
75		store,
76		initData.data( 'initial-form-values' ),
77		'membershipFormContent'
78		);
79
80		// Connect view handlers to changes in specific parts in the global state, designated by 'stateKey'
81		WMDE.StoreUpdates.connectViewHandlersToStore(
82		[
83		{
84		viewHandler: WMDE.View.createFormPageVisibilityHandler( {
85		personalData: $( "#personalDataPage" ),
86		bankConfirmation: $( '#bankConfirmationPage' )
87		} ),
88		stateKey: 'formPagination'
89		},
90		{
91		viewHandler: WMDE.View.createErrorBoxHandler( $( '#validation-errors' ), {
92		amount: 'Betrag',
93		salutation: 'Anrede',
94		title: 'Titel',
95		firstName: 'Vorname',
96		lastName: 'Nachname',
97		companyName: 'Firma',
98		street: 'Straße',
99		postcode: 'PLZ',
100		city: 'Ort',
101		country: 'Land',
102		email: 'E-Mail',
103		dateOfBirth: 'Geburtsdatum',
104		phone: 'Telefonnummer',
105		iban: 'IBAN',
106		bic: 'BIC',
107		accountNumber: 'Kontonummer',
108		bankCode: 'Bankleitzahl',
109		confirmSepa: 'SEPA-Lastschrift'
110		} ),
111		stateKey: 'membershipInputValidation'
112		},
113		{
114		viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#finishFormSubmit' ), /^PPL$\|^$/ ),
115		stateKey: 'membershipFormContent.paymentType'
116		},
117		{
118		viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#continueFormSubmit' ), 'BEZ' ),
119		stateKey: 'membershipFormContent.paymentType'
120		},
121		{
122		viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.fields-direct-debit' ), 'BEZ' ),
123		stateKey: 'membershipFormContent.paymentType'
124		},
125		{
126		viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.slide-sepa' ), 'sepa' ),
127		stateKey: 'membershipFormContent.debitType'
128		},
129		{
130		viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.slide-non-sepa' ), 'non-sepa' ),
131		stateKey: 'membershipFormContent.debitType'
132		},
133		{
134		viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.person-name' ), 'person' ),
135		stateKey: 'membershipFormContent.addressType'
136		},
137		{
138		viewHandler: WMDE.View.createSlidingVisibilitySwitcher( $( '.company-name' ), 'firma' ),
139		stateKey: 'membershipFormContent.addressType'
140		},
141		{
142		viewHandler: WMDE.View.createSimpleVisibilitySwitcher( $( '#address-type-2' ).parent(), 'sustaining' ),
143		stateKey: 'membershipFormContent.membershipType'
144		},
145		{
146		viewHandler: WMDE.View.createFeeOptionSwitcher( [ $( '#amount-1' ), $( '#amount-2' ), $( '#amount-3' ), $( '#amount-4' ), $( '#amount-5' ), $( '#amount-6' ), $( '#amount-7' ) ], { person: 24, firma: 100 } ),
147		stateKey: 'membershipFormContent'
148		},
149		{
150		viewHandler: WMDE.View.createPaymentSummaryDisplayHandler(
151		$( '#membership-confirm-interval' ),
152		$( '#membership-confirm-fee'),
153		$( '#membership-payment-type' ), // does not exist yet
154		{
155		'0': 'einmalig',
156		'1': 'monatlich',
157		'3': 'quartalsweise',
158		'6': 'halbjährlich',
159		'12': 'jährlich'
160		},
161		{
162		'BEZ': 'Lastschrift',
163		'UEB': 'Überweisung',
164		'MCP': 'Kreditkarte',
165		'PPL': 'PayPal'
166		},
167		WMDE.CurrencyFormatter.createCurrencyFormatter( 'de' )
168		),
169		stateKey: 'membershipFormContent'
170		},
171		{
172		viewHandler: WMDE.View.createDisplayAddressHandler( {
173		fullName: $( '#membership-confirm-name' ),
174		street: $( '#membership-confirm-street' ),
175		postcode: $( '#membership-confirm-postcode' ),
176		city: $( '#membership-confirm-city' ),
177		country: $( '#membership-confirm-country' ),
178		email: $( '#membership-confirm-mail' )
179		} ),
180		stateKey: 'membershipFormContent'
181		},
182		{
183		viewHandler: WMDE.View.createBankDataDisplayHandler(
184		$( '#membership-confirm-iban' ),
185		$( '#membership-confirm-bic' ),
186		$( '#membership-confirm-bankname' )
187		),
188		stateKey: 'membershipFormContent'
189		},
190		{
191		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#first-name' ) ),
192		stateKey: 'membershipInputValidation.firstName'
193		},
194		{
195		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#last-name' ) ),
196		stateKey: 'membershipInputValidation.lastName'
197		},
198		{
199		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#street' ) ),
200		stateKey: 'membershipInputValidation.street'
201		},
202		{
203		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#post-code' ) ),
204		stateKey: 'membershipInputValidation.postcode'
205		},
206		{
207		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#city' ) ),
208		stateKey: 'membershipInputValidation.city'
209		},
210		{
211		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#email' ) ),
212		stateKey: 'membershipInputValidation.email'
213		},
214		{
215		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#company-name' ) ),
216		stateKey: 'membershipInputValidation.companyName'
217		},
218		{
219		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#date-of-birth' ) ),
220		stateKey: 'membershipInputValidation.dateOfBirth'
221		},
222		{
223		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#phone' ) ),
224		stateKey: 'membershipInputValidation.phoneNumber'
225		},
226		{
227		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#iban' ) ),
228		stateKey: 'membershipInputValidation.iban'
229		},
230		{
231		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#bic' ) ),
232		stateKey: 'membershipInputValidation.bic'
233		},
234		{
235		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#account-number' ) ),
236		stateKey: 'membershipInputValidation.accountNumber'
237		},
238		{
239		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '#bank-code' ) ),
240		stateKey: 'membershipInputValidation.bankCode'
241		},
242		{
243		viewHandler: WMDE.View.createFieldValueValidityIndicator( $( '.amount-input' ) ),
244		stateKey: 'membershipInputValidation.amount'
245		}
246		],
247		store
248		);
249
250		// Validity checks for different form parts
251
252		function displayErrorBox() {
253		$( '#validation-errors' ).show();
254		$( 'html, body' ).animate( { scrollTop: $( '#validation-errors' ).offset().top } );
255		}
256
257		function addressIsValid() {
258		return store.getState().validity.address;
259		}
260
261		function bankDataIsValid() {
262		return store.getState().membershipFormContent.paymentType !== 'BEZ' \|\| store.getState().validity.bankData;
263		}
264
265		function formDataIsValid() {
266		var validity = store.getState().validity;
267		return !hasInvalidFields() && validity.paymentData && addressIsValid() && bankDataIsValid();
268		}
269
270		function triggerValidityCheckForPersonalDataPage() {
271		var formContent = store.getState().membershipFormContent;
272
273		if ( !addressIsValid() ) {
274		if ( formContent.addressType === 'person' ) {
275		store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
276		[ 'salutation', 'firstName', 'lastName', 'street', 'postcode', 'city', 'email' ],
277		[ 'companyName' ]
278		) );
279		} else if ( formContent.addressType === 'firma' ) {
280		store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
281		[ 'companyName', 'street', 'postcode', 'city', 'email' ],
282		[ 'firstName', 'lastName', 'salutation' ]
283		) );
284		}
285		}
286
287		if ( !bankDataIsValid() ) {
288		store.dispatch( actions.newMarkEmptyFieldsInvalidAction(
289		[ 'iban', 'bic' ]
290		) );
291		}
292
293		if ( !store.getState().validity.amount ) {
294		store.dispatch( actions.newMarkEmptyFieldsInvalidAction( [ 'amount' ] ) );
295		}
296		}
297
298		function hasInvalidFields() {
299		var invalidFields = false;
300		$.each( store.getState().membershipInputValidation, function( key, value ) {
301		if ( value.isValid === false ) {
302		invalidFields = true;
303		}
304		} );
305
306		return invalidFields;
307		}
308
309		function triggerValidityCheckForSepaPage() {
310		if ( !store.getState().validity.sepaConfirmation ) {
311		store.dispatch( actions.newMarkEmptyFieldsInvalidAction( [ 'confirmSepa' ] ) );
312		}
313		}
314
315		function handleMembershipDataSubmitForDirectDebit() {
316		if ( formDataIsValid() ) {
317		store.dispatch( actions.newNextPageAction() );
318		$( 'section#donation-amount, section#donation-sheet' ).hide();
319		} else {
320		triggerValidityCheckForPersonalDataPage();
321		displayErrorBox();
322		}
323		}
324
325		function handleMembershipDataSubmitForNonDirectDebit() {
326		if ( formDataIsValid() ) {
327		$( '#memForm' ).submit();
328		} else {
329		triggerValidityCheckForPersonalDataPage();
330		displayErrorBox();
331		}
332		}
333
334		$( '#continueFormSubmit' ).click( WMDE.StoreUpdates.makeEventHandlerWaitForAsyncFinish( handleMembershipDataSubmitForDirectDebit, store ) );
335
336		$( '#finishFormSubmit' ).click( WMDE.StoreUpdates.makeEventHandlerWaitForAsyncFinish( handleMembershipDataSubmitForNonDirectDebit, store ) );
337
338		$( '.back-button' ).click( function () {
339		// TODO check if page is valid
340		store.dispatch( actions.newResetFieldValidityAction( [ 'confirmSepa' ] ) );
341		store.dispatch( actions.newPreviousPageAction() );
342		} );
343
344		$( '#finishFormSubmit2' ).click( function () {
345		if ( store.getState().validity.sepaConfirmation ) {
346		$( '#memForm' ).submit();
347		} else {
348		triggerValidityCheckForSepaPage();
349		displayErrorBox();
350		}
351		} );
352
353		// Initialize form pages
354		store.dispatch( actions.newAddPageAction( 'personalData' ) );
355		store.dispatch( actions.newAddPageAction( 'bankConfirmation' ) );
356
357		// Set initial form values
358		store.dispatch( actions.newInitializeContentAction( initData.data( 'initial-form-values' ) ) );
359
360		} );
361

wmde / FundraisingFrontend

Push — master ( ebbfd2...019445 )

membershipForm.js ➔ ... ➔ addressIsValid A

Complexity

Size

Duplication

Importance

Duplication Side-by-Side

Filter issues like